<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script type="text/javascript" src="./data/static/js/jquery-1.12.4.js"></script>
<script>
    //正常写法
    $(function () {
        $.ajax({
            url: "data/user.json",
            success(data) {
                console.log("查询用户：", data);
                $.ajax({
                    url: `data/user_corse_${data.id}.json`,
                    success(data) {
                        console.log("查询到课程：", data);
                        $.ajax({
                            url: `data/corse_score_${data.id}.json`,
                            success(data) {
                                console.log("查询到分数：", data);
                            },
                            error(error) {
                                console.log("出现异常了：" + error);
                            }
                        });
                    },
                    error(error) {
                        console.log("出现异常了：" + error);
                    }
                });
            },
            error(error) {
                console.log("出现异常了：" + error);
            }
        });
    })

    //Promise语法
    // const promise = new Promise(function (resolve, reject) {
    //     constpromise = newPromise(function (resolve,
    //         reject
    //     ) { //执行异步操作if(/*异步操作成功*/){resolve(value);//调用resolve，代表Promise将返回成功的结果}else{reject(error);//调用reject，代表Promise会返回失败结果}});
    //     });
    // });

    //使用箭头函数Promise语法
    //const promise = newPromise((resolve,
    // reject) => { //执行异步操作if(/*异步操作成功*/){resolve(value);//调用resolve，代表Promise将返回成功的结果}else{reject(error);//调用reject，代表Promise会返回失败结果}});


    //处理异步结果
    // promise.then(function (value) { //异步执行成功后的回调}).catch(function(error){//异步执行失败后的回调})

    //Promise改造以前嵌套方式
    newPromise((resolve, reject) => {
        $.ajax({
            url: "./data/user.json",
            success(data) {
                console.log("查询用户：", data);
                resolve(data.id);
            },
            error(error) {
                console.log("出现异常了：" + error);
            }
        });
    }).then((userId) => {
        returnnewPromise((resolve, reject) => {
            $.ajax({
                url: `./data/user_corse_${userId}.json`,
                success(data) {
                    console.log("查询到课程：", data);
                    resolve(data.id);
                },
                error(error) {
                    console.log("出现异常了：" + error);
                }
            });
        });
    }).then((corseId) => {
        console.log(corseId);
        $.ajax({
            url: `./data/corse_score_${corseId}.json`,
            success(data) {
                console.log("查询到分数：", data);
            },
            error(error) {
                console.log("出现异常了：" + error);
            }
        });
    });

    //优化处理
    //优化：通常在企业开发中，会把promise封装成通用方法，如下：封装了一个通用的get请求方法；
    //let get =function(url,data){//实际开发中会单独放到common.js中returnnewPromise((resolve,reject)=>{$.ajax({url:url,type:"GET",data:data,success(result){resolve(result);},error(error){reject(error);}});})}//使用封装的get方法，实现查询分数get("mock/user.json").then((result)=>{console.log("查询用户：",result);returnget(`mock/user_corse_${result.id}.json`);}).then((result)=>{console.log("查询到课程：",result);returnget(`mock/corse_score_${result.id}.json`)}).then((result)=>{console.log("查询到分数：",result);}).catch(()=>{console.log("出现异常了："+error);});
</script>

<body>

</body>

</html>